<template>
  <div class="footer">
    <div class="container">
      <div class="left">
        <p class="link" id="music-link">
          <a href="javascript:;" target="_blank" class="item s-fc4">服务条款</a>
          <span class="line">|</span>
          <a href="javascript:;" target="_blank" class="item s-fc4">隐私政策</a>
          <span class="line">|</span>
          <a href="javascript:;" class="item s-fc4">儿童隐私政策</a>
          <span class="line">|</span>
          <a href="//music.163.com/st/staticdeal/complaints.html" class="item s-fc4">版权投诉指引</a>
          <span class="line">|</span>
          <a id="g_feedback" href="#" class="s-fc4">意见反馈</a>
          <span class="line">|</span>
          <a href="javascript:;" class="item s-fc4">广告合作</a>
        </p>
        <p class="right s-fc3">
          <span class="sep span">网易公司版权所有©1997-2021</span>
          <span class="span">杭州乐读科技有限公司运营：</span>
          <a href="javascript" target="_blank" class="alink s-fc3">浙网文[2021] 1186-054号</a>
        </p>
        <p class="contact s-fc3">
          <span class="sep span">违法和不良信息举报电话：0571-89853516</span>
          <span class="span">举报邮箱：</span>
          <a class="alink" href="javascript:;">ncm5990@163.com</a>
        </p>
        <p class="right s-fc3">
          <a href="javascript:;" class="alink s-fc3">粤B2-20090191-18&nbsp;&nbsp;工业和信息化部备案管理系统网站</a>
          <a href="javascript:;" class="alink s-fc3 police-link">
            <span class="police-logo"></span>
            <span>浙公网安备 33010902002564号</span>
          </a>
        </p>
      </div>
      <div class="rightContainer">
        <ul>
          <li class="unit">
            <a class="logo logoPic bg-1" href="javascript:;"></a>
            <span class="tt t-bg  t-bg-1"></span>
          </li>
          <li class="unit">
            <a class="logo logoPic bg-2" href="javascript:;"></a>
            <span class="tt t-bg  t-bg-2"></span>
          </li>
          <li class="unit">
            <a class="logo logoPic bg-3" href="javascript:;"></a>
            <span class="tt t-bg  t-bg-3"></span>
          </li>
          <li class="unit">
            <a class="logo logoPic bg-4" href="javascript:;"></a>
            <span class="tt t-bg  t-bg-4"></span>
          </li>
          <li class="unit">
            <a class="logo logoPic bg-5" href="javascript:;"></a>
            <span class="tt t-bg  t-bg-5"></span>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {}
</script>

<style scoped>
.footer {
  position: relative;
  bottom: 0;
  width: 100%;
  height: 172px;
  overflow: hidden;
  border-top: 1px solid #d3d3d3;
  background: #f2f2f2;
}
.container {
  display: flex;
  width: 980px;
  margin: 0 auto;
}
.left {
  width: 520px;
  padding-top: 15px;
  line-height: 24px;
}
.s-fc4,
a.s-fc4:hover {
  color: #999;
}
.rightContainer {
  width: 420px;
  margin-top: 33px;
}
.line {
  margin: 0 8px 0 10px;
  color: #c2c2c2;
}
.left .sep {
  margin-right: 14px;
}
.police-logo {
  width: 14px;
  height: 14px;
  background: url(https://s2.music.126.net/style/web2/img/3rd/police.png?371ed0e5e4ad7ff9c63ff9167cace738) no-repeat;
  background-size: cover;
  display: inline-block;
  margin-right: 2px;
  vertical-align: -2px;
}
ul {
  display: flex;
  justify-content: space-between;
}
.unit {
  width: 60px;
  height: 70px;
  text-align: center;
  color: #666;
}
.logo {
  display: block;
  width: 50px;
  height: 45px;
}
.logoPic {
  background: url(https://s2.music.126.net/style/web2/img/foot_enter_new.png?a2572af44f81ecc97bdf0a2f145a151a) no-repeat;
  background-size: 110px 552px;
}
.t-bg {
  background: url(https://s2.music.126.net/style/web2/img/foot_enter_tt.png?fd0b891ccacc0ba486ef449dc7c0af94) no-repeat;
  background-size: 180px 139px;
}
.tt {
  display: inline-block;
  margin: 5px 5px 0;
  width: 52px;
  height: 14px;
  margin-left: 0px;
}
.bg-1 {
  background-position: -63px -456.5px;
}
.bg-2 {
  background-position: -63px -101px;
}
.bg-3 {
  background-position: 0 -0;
}
.bg-4 {
  background-position: -60px -50px;
}
.bg-5 {
  background-position: 0 -101px;
}
.t-bg-1 {
  background-position: 0 -108px;
  margin-left: -10px;

  width: 72px;
}
.t-bg-2 {
  background-position: -1px -91px;
}
.t-bg-3 {
  background-position: 0 0;
}
.t-bg-4 {
  background-position: 0 -54px;
}
.t-bg-5 {
  background-position: -1px -72px;
}
</style>
